@font-face {
    font-family: Phun-Sans;
    font-weight: 400;
    src: url(https://kaeru2193.github.io/Phun-Resources/font/Phun-Sans/Phun-Sans-Rounded-Regular.woff) format("woff")
}

#map {
    height: 500px;
}

#toggleBtn {
    background: linear-gradient(45deg, red, orange, yellow, green, blue, indigo, violet);
    border: none;
    border-radius: 12px;
    color: black;
    padding: 15px 30px;
    font-size: 20px;
    cursor: pointer;
    transition: transform 0.2s;
}

a {
    text-decoration: none;
    color: var(--text-colour);
}

body {
    margin: 0px;
    font-size: 120%;
    background-color: var(--background-colour);
}

footer {
    background-color: var(--main-colour);
    text-align: center;
    margin-top: 2%;
    padding-top: 5px;
}

html {
    --background-colour: white;
    --main-colour: gainsboro;
    --title-colour: gray;
    color: black;
    margin: 0px;
}

img {
    width: 180px;
}

small {
    font-size: x-small;
}

:lang(en) {
    font-family: "Catamaran", sans-serif;
}

:lang(ja) {
    font-family: "Noto Sans JP", sans-serif;
}

:lang(phn) {
    font-family: 'Phun-Sans', serif;
}

:lang(tok) {
    font-family: "Catamaran", sans-serif;
}
.blue{
    color: blue;
}
.hidden {
    color: var(--main-colour);
}

.lipuante {
    background-color: var(--main-colour);
    height: max-content;
    width: 100%;
    padding-top: 3px;
    padding-bottom: 3px;
}

.nenamute {
    margin-left: auto;
    margin-right: auto;
}

.nimi {
    margin-left: auto;
    margin-right: auto;
}

.nimiante {
    margin-left: 10%;
}

.nimilipu {
    margin-left: 10%;
    font-size: 2rem;
    float: left;
    height: 4rem;
}
.phun {
    font-size: 2rem;
}
.phundiv{
    padding-left: 2rem;
}
.red{
    color: red;
}
.sewi {
    background-color: var(--title-colour);
    height: 5rem;
    vertical-align: top;
    display: flow-root;
    padding-top: 2%;
}

.toki {
    background-color: var(--main-colour);
    padding: 1%;
    border-radius: 20px;
    max-width: 50rem;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2%;
    position: relative;
}

.tokiante {
    background-color: white;
    width: max-content;
    margin-left: auto;
    margin-right: 10%;
    margin-top: 10px;
    border: 2px solid black;
    border-radius: 20px;
    padding: 5px;
    vertical-align: text-bottom;
}